<template>
	<view class="container">
		<view style="width: 90%;margin-top: 10rpx;">
			<u-search :showAction="true" actionText="搜索" :animation="true" :clearabled="true" placeholder="请输入内容"
				v-model="searchText" @custom="search()" @clear="clearInput()"></u-search>
			<view class="action-buttons">
				<!-- <u-button type="error" @click="addGradeStudent()">初始化</u-button> -->
				<u-button type="error" @click="previewImage()">使用说明</u-button>
				<u-button type="primary" @click="sendRequest">刷新数据</u-button>
			</view>
			<view class="action-buttons">
				<uni-tag text="最新数据" custom-style="background-color: #4335d6; border-color: #4335d6; color: #fff;">
				</uni-tag>
				<!-- <uni-tag type="success" text="最新数据" size="default" /> -->
				<text>{{data[0].weekName}}</text>
			</view>
		</view>
		<div class="loader" v-if="loading"></div>
		<!-- 	<view class="code-info code-item" style="margin-top: 50rpx;">
			<span class="label">周数：</span>
		</view> -->

		<view v-for="(item, index) in data" :key="index" class="code-item" v-if="item.flag">
			<view class="code-info">
				<span class="label"> 第{{item.weekName}}周 </span>
				<uni-tag type="warning" style="margin-right: 10rpx;" text="复制链接" size="default"
					@click="handleCopyLink(item.url)" />
				<uni-tag type="success" text="导入此数据" size="default" @click="inData(item.url,item.weekName)" />
			</view>
			<!-- 新增的说明部分 -->
			<view class="week-description">
				{{item.description}}
			</view>
		</view>
	</view>
</template>

<style scoped>
	.loader {
		position: fixed;
		/* 固定定位 */
		top: 50%;
		/* 垂直居中 */
		left: 50%;
		/* 水平居中 */
		transform: translate(-50%, -50%);
		/* 通过偏移使其真正居中 */
		width: 50px;
		aspect-ratio: 1;
		display: grid;
		z-index: 999;
	}

	.loader::before,
	.loader::after {
		content: "";
		grid-area: 1/1;
		--c: no-repeat radial-gradient(farthest-side, #25b09b 92%, #0000);
		background:
			var(--c) 50% 0,
			var(--c) 50% 100%,
			var(--c) 100% 50%,
			var(--c) 0 50%;
		background-size: 12px 12px;
		animation: l12 1s infinite;
	}

	.loader::before {
		margin: 4px;
		filter: hue-rotate(45deg);
		background-size: 8px 8px;
		animation-timing-function: linear;
	}

	@keyframes l12 {
		100% {
			transform: rotate(.5turn);
		}
	}

	.download-link {
		text-decoration: none;
		/* 去掉下划线 */
	}

	.action-buttons {
		margin-top: 20rpx;
		margin-bottom: 20rpx;
		display: flex;
		flex-direction: row;
		/* 默认是row，可省略 */
		justify-content: space-between;
		/* 根据需要调整对齐方式 */
		gap: 10px;
		/* 按钮之间的间距 */
	}


	/* 状态 */
	.greenBackground {
		padding: 5px;
		border-radius: 8px;
		background-color: rgb(40, 167, 69);
		/* 有效的背景色为绿色 */
		color: white;
		font-weight: bold;
		/* 可选：设置文字颜色 */
	}

	.redBackground {
		border-radius: 8px;
		padding: 5px;
		background-color: red;
		/* 无效的背景色为红色 */
		color: white;
		font-weight: bold;
		/* 可选：设置文字颜色 */
	}

	/* 其他 */
	.inline-container {
		display: inline-block;
		margin-top: 10px;
		/* 或者使用 display: inline-flex; */
	}

	.peizhi {
		padding: 3px;
		color: white;
		background-color: #007bff;
		margin-top: 4px;
	}

	.bangDing {
		padding: 3px;
		color: white;
		background-color: #ff55ff;
		margin-top: 4px;
	}

	.qqKey {
		padding: 3px;
		color: white;
		background-color: #aa55ff;
		margin-top: 4px;
	}

	.container {
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.code-item {
		width: 90%;
		padding: 5px;
		margin-top: 5px;
		margin-bottom: 5px;
		border: 1px solid #ccc;
		border-radius: 5px;
		box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	}

	.code-info {
		/* display: flex;
		flex-direction: column; */
		display: flex;
		/* 使用 Flexbox */
		justify-content: space-between;
		/* 左右分开对齐 */
		align-items: center;
	}

	.label {
		font-weight: bold;
	}

	.week-description {
		margin-top: 10px;
		padding: 10px;
		background-color: #f9f9f9;
		border-radius: 5px;
		border: 1px solid #eee;
		font-size: 14px;
		color: #666;
	}

	.value {
		margin-bottom: 5px;
	}

	.qq {
		font-style: italic;
	}

	/* 允许文本被选择 */
	.selectable-text {
		user-select: text;
		/* 标准语法 */
		-webkit-user-select: text;
		/* Safari */
		-moz-user-select: text;
		/* Firefox */
		-ms-user-select: text;
		/* IE10+/Edge */
		cursor: text;
		/* 提供一个文本光标，增加交互性 */
	}

	.explanation {
		margin-top: 20px;
		color: #666;
		font-size: 16px;
		line-height: 1.6;
	}

	.explanation span {
		display: inline-block;
		background-color: #f0f0f0;
		padding: 5px 10px;
		border-radius: 5px;
		cursor: pointer;
		transition: background-color 0.3s;
	}

	.search-bar {
		width: 95%;
		display: flex;
		/* 使用 flexbox 布局 */
		align-items: center;
		/* 垂直居中对齐 */
		position: sticky;
		/* 使用粘性定位 */
		top: 0;
		/* 当滚动到.pokemon-container的顶部时固定 */
		padding: 15rpx;
		/* 根据需要添加内边距 */
		z-index: 10;
		/* 确保这些元素在页面最上层 */
		margin-bottom: -50rpx;
		/* 根据需要调整边距 */
	}
</style>

<script>
	import * as XLSX from 'xlsx'; // 引入 xlsx 库
	import DATA from '@/static/lhszData.json';
	export default {
		data() {
			return {
				searchText: '',
				weekName: '',
				data: [{
					"weekName": "未刷新",
					"description": "",
					"flag": false,
					"url": ""
				}], // 存储请求返回的数据
				timer: null, // 用于定时器
				weeks: [],
				loading: false, // 控制加载图标的显示与隐藏
			};
		},
		methods: {
			previewImage(item) {
				let urls = [];
				// urls = [item];
				urls = ['/static/shuoMing.png'];

				uni.previewImage({
					current: '', // 当前显示图片的链接，可选
					urls: urls // 需要预览的图片链接列表
				});
			},
			handleCopyLink(url) {
				// 这里执行复制链接的逻辑
				uni.setClipboardData({
					data: url, // 这里是你要复制的链接
					success: function() {
						uni.showToast({
							title: '链接已复制',
							icon: 'success'
						});
					}
				});
			},
			// 自定义请求方法
			sendRequest() {
				uni.request({
					url: 'https://zc-oss2.oss-cn-hongkong.aliyuncs.com/lhsz/lhszData.json', // 示例请求 URL
					method: 'GET',
					success: (response) => {
						this.data = response.data; // 请求成功后处理数据
						uni.setStorageSync("龙湖四中成绩", response.data);
						uni.showToast({
							title: "更新成功！",
							icon: 'success', // 不显示图标  
							duration: 1000 // 提示框显示时间，单位为 ms  
						});
					},
					fail: (error) => {
						console.error('请求失败:', error); // 请求失败时处理
					},
				});
			},

			// 设置每天自动请求一次
			setupDailyRequest() {
				// 获取当前时间
				const now = new Date();

				// 计算距离明天0点的毫秒数
				const nextMidnight = new Date(now);
				nextMidnight.setHours(24, 0, 0, 0);
				const delayToNextRequest = nextMidnight - now;

				// 首次请求会在明天0点触发
				setTimeout(() => {
					this.sendRequest(); // 发送请求
					this.setupDailyRequest(); // 重新设置请求

					// 每隔24小时自动触发一次请求
					this.timer = setInterval(this.sendRequest, 24 * 60 * 60 * 1000);
				}, delayToNextRequest);
			},
			clearInput() {
				this.searchText = '';
				this.data = uni.getStorageSync("龙湖四中成绩");

			},
			search() {
				if (this.searchText === '') {
					// 如果搜索文本为空，返回全部数据
					this.data = uni.getStorageSync("龙湖四中成绩") || DATA;
				} else {
					// 如果搜索文本不为空，过滤数据
					let showData = uni.getStorageSync("龙湖四中成绩");

					// 确保 showData 存在且为数组
					if (Array.isArray(showData)) {
						this.data = showData.filter(item => {
							return item.weekName && (
								item.weekName.includes(this.searchText) ||
								(item.description && item.description.includes(this.searchText))
							);
						});
					} else {
						console.error("没有获取到有效的数据");
					}

				}
			},
			// 初始化学生数据
			addGradeStudent() {
				// 使用 uni.request 下载文件
				uni.request({
					url: 'https://zc-oss2.oss-cn-hongkong.aliyuncs.com/lhsz/%E4%B8%83%E5%B9%B4%E7%BA%A7%E6%95%B0%E5%AD%A6%E7%99%BB%E5%88%86%E8%A1%A8.xlsx',
					method: 'GET',
					responseType: 'arraybuffer', // 确保以二进制格式接收文件
					success: (res) => {
						if (res.statusCode === 200) {
							// 下载成功，开始解析文件
							this.parseExcel(res.data);
						} else {
							console.error('文件下载失败:', res.statusCode);
						}
					},
					fail: (err) => {
						console.error('请求失败:', err);
					},
				});
			},
			// 导入成绩
			inData(url, name) {
				// 使用 uni.request 下载文件
				uni.request({
					url: url,
					method: 'GET',
					responseType: 'arraybuffer', // 确保以二进制格式接收文件
					success: (res) => {
						if (res.statusCode === 200) {
							// 下载成功，开始解析文件
							this.weekName = name;
							this.loading = true;
							// 确保 both 为数字类型
							this.$dbUtils.delData('testDb', 'gradeScores', {
								week: Number(this.weekName)
							});
							console.log("删除旧成绩成功");
							this.parseScoresExcel(res.data);
							console.log("==导入数据的周数：==" + this.weekName)
						} else {
							console.error('文件下载失败:', res.statusCode);
						}
					},
					fail: (err) => {
						console.error('请求失败:', err);
					},
				});
			},

			// 解析 Excel 数据
			parseExcel(data) {
				try {
					// 将二进制数据转换为工作簿对象
					const workbook = XLSX.read(data, {
						type: 'array'
					});

					// 选择要解析的工作表（假设是第一个工作表）
					const worksheet = workbook.Sheets[workbook.SheetNames[0]];

					// 将工作表转换为 JSON 格式（数组）
					const jsonData = XLSX.utils.sheet_to_json(worksheet, {
						header: 1
					}); // header: 1 表示使用第一行作为列标题

					// 将原始数据转换为目标格式
					let students = [];
					students = jsonData.slice(1).map(row => {
						return {
							student_class: row[0], // 班级
							name: row[1], // 姓名
							student_id: row[3], // 座号（学号）
						};
					});
					// 插入数据时显示加载图标
					this.loading = true;
					console.log('转换后的学生数据:', students);
					students.forEach(item => {
						this.$dbUtils.addTabItem('testDb', 'gradeStudents', item);
					});
					// 插入完成后隐藏加载图标
					this.loading = false;
					uni.showToast({
						title: '初始化成功',
						icon: 'success'
					});
				} catch (error) {
					console.error('Excel 解析失败:', error);
				}
			},
			async addJFData(studentsData) {
				// 初始化一个对象用来存储每个班级的统计数据
				const classData = {};

				// 积分计算函数
				function calculatePoints(score) {
					if (score === 120) return 15;
					else if (score >= 114) return 14;
					else if (score >= 108) return 12;
					else if (score >= 102) return 10;
					else if (score >= 96) return 8;
					else if (score >= 84) return 6;
					else if (score >= 72) return 4;
					else if (score >= 60) return 2;
					else if (score >= 48) return 1;
					else return 0;
				}

				// 处理学生数据并统计每个班级的积分和平均分
				studentsData.forEach(student => {
					const {
						student_class,
						score
					} = student;

					// 如果班级数据还没有初始化，初始化班级数据
					if (!classData[student_class]) {
						classData[student_class] = {
							totalPoints: 0,
							totalScore: 0,
							studentCount: 0
						};
					}

					// 累加班级积分和成绩
					const points = calculatePoints(score);

					// 只累加得分大于0的学生
					if (score > 0) {
						classData[student_class].totalPoints += points;
						classData[student_class].totalScore += score;
						classData[student_class].studentCount++;
					}
				});

				// 输出最终结果
				const result = Object.keys(classData).map(className => {
					const classStats = classData[className];
					// 避免除以0，防止除零错误
					const averageScore = classStats.studentCount > 0 ?
						(classStats.totalScore / classStats.studentCount) :
						0;
					return {
						className,
						averageScore: averageScore.toFixed(2), // 保留两位小数
						totalPoints: classStats.totalPoints,
						week: this.weekName, // 周数
					};
				});
				console.log(result);

				this.$dbUtils.delData('testDb', 'scoreChart', {
						week: this.weekName
					})
					.then(async (response) => {
						console.log("删除图表成功:", response);
						// 创建一个数组，存储所有 addTabItem 的 Promise
						const addPromises = result.map(item => this.$dbUtils.addTabItem('testDb', 'scoreChart',
							item));

						// 使用 Promise.all 来并发执行所有的 addTabItem 操作
						await Promise.all(addPromises);
						console.log("图表更新成功");
					})
					.catch(error => {
						console.error("删除失败:", error);
						uni.showToast({
							title: '请先手动删除',
							icon: 'none'
						});
					});
			},
			// 解析 成绩Excel 数据
			async parseScoresExcel(data) {
				try {
					// 将二进制数据转换为工作簿对象
					const workbook = XLSX.read(data, {
						type: 'array'
					});

					// 选择要解析的工作表（假设是第一个工作表）
					const worksheet = workbook.Sheets[workbook.SheetNames[0]];

					// 将工作表转换为 JSON 格式（数组）
					const jsonData = XLSX.utils.sheet_to_json(worksheet, {
						header: 1
					}); // header: 1 表示使用第一行作为列标题
					// 将原始数据转换为目标格式
					let students = [];
					students = jsonData.slice(1).map(row => {
						return {
							student_class: row[0], // 班级
							name: row[1], // 姓名
							// score: row[4], // 成绩
							score: (row[4] !== undefined && row[4] !== null && !isNaN(row[4]) && !
									/[\u4e00-\u9fa5]/.test(row[4])) ?
								parseInt(row[4], 10) : 0,
							student_id: row[3], // 学号
							week: this.weekName, // 周数
						};
					});
					console.log('转换后的学生数据:', students);
					this.addJFData(students);
					uni.setStorageSync("积分计算数据" + this.weekName, students)
					// 排序学生成绩，从高到低
					students.sort((a, b) => b.score - a.score);

					// 计算年级排名
					students.forEach((student, index) => {
						// 如果当前学生与前一个学生成绩相同，给当前学生相同的排名
						if (index > 0 && students[index].score === students[index - 1].score) {
							student.grade_rank = students[index - 1].grade_rank;
						} else {
							// 如果成绩不同，排名应该是当前索引加1
							student.grade_rank = index + 1;
						}
					});

					// 按班级分组
					const groupedByClass = students.reduce((acc, student) => {
						if (!acc[student.student_class]) {
							acc[student.student_class] = [];
						}
						acc[student.student_class].push(student);
						return acc;
					}, {});

					// 计算班级排名
					Object.keys(groupedByClass).forEach(className => {
						const classStudents = groupedByClass[className];

						// 按成绩从高到低排序
						classStudents.sort((a, b) => b.score - a.score);

						// 计算班级排名
						classStudents.forEach((student, index) => {
							// 处理成绩相同的学生，赋予相同排名
							if (index > 0 && classStudents[index].score === classStudents[index - 1]
								.score) {
								student.class_rank = classStudents[index - 1].class_rank;
							} else {
								student.class_rank = index + 1; // 排名从1开始
							}
						});
					});

					// 输出结果，检查是否正确
					console.log("==处理好的数组==:", students);

					// 插入数据到数据库
					for (const item of students) {
						this.$dbUtils.addTabItem('testDb', 'gradeScores', item);
					}
					// 插入完成后隐藏加载图标
					this.loading = false;
					// 等待所有操作完成后再显示成功的提示
					uni.showToast({
						title: '更新成功',
						icon: 'success'
					});
					let weeksData = uni.getStorageSync("龙湖四中周数") || [];
					// weeksData.push(Number(this.weekName));
					weeksData.push(this.weekName);
					weeksData = [...new Set(weeksData)]; // 转换为 Set 再转换回数组
					uni.setStorageSync("龙湖四中周数", weeksData)
				} catch (error) {
					console.error('Excel 解析失败:', error);
				}
			},
		},
		mounted() {
			this.data = uni.getStorageSync("龙湖四中成绩");
			this.weeks = uni.getStorageSync("龙湖四中周数");
			console.log(this.weeks);
			this.setupDailyRequest(); // 组件挂载时，启动自动请求
		},
		beforeDestroy() {
			// 清除定时器，避免内存泄漏
			if (this.timer) {
				clearInterval(this.timer);
			}
		}


	};
</script>